<template>
    <div>

        <div>
            <van-row>
                <van-col align="center" span="8" style="margin-top: 2rem">

                    <van-image
                            round
                            width="5rem"
                            height="5rem"
                            fit="cover"
                            :src="userinfo.headimgurl"
                            @click="popupShow(true)"
                    />
                    <van-dialog v-model="popShow" title="头像" :show-cancel-button="false" :show-confirm-button="false" :close-on-click-overlay="true">
                        <van-image
                                width="20rem"
                                height="20rem"
                                :src="userinfo.headimgurl"
                                @click="popupShow"
                        />
                        <van-button type="default" size="normal" style="margin-right: 1rem;margin-bottom: 1rem" @click="popupShow(false)">取 消</van-button>
                        <van-uploader :after-read="afterRead" preview-image="false" style="margin-right: 1rem;margin-bottom: 1rem"><van-button type="primary" size="normal">修改头像</van-button></van-uploader>
                    </van-dialog>

                </van-col>
                <van-col span="12" style="margin-top: 2rem;height:5rem;font-size: 1.5rem"><p align="left">
                    {{userinfo.nickname}}</p></van-col>

            </van-row>
            <van-cell-group align="left" style="margin-top: 2rem;margin-bottom: 2rem">
                <van-cell title="用户姓名" v-model="result.username" size="large"/>
                <van-cell title="手机号码" v-model="result.phoneNumber" size="large"/>
            </van-cell-group>
            <van-grid clickable :gutter="10" style="margin-top: 2rem;margin-bottom: 2rem">
                <van-grid-item align="center"
                               v-for="value in powerItem"
                               :key="value.index"
                               :icon="value.buttonIcon"
                               :text="value.buttonText"
                               @click="commLogin(value.buttonLoginUrl,value.buttonTargetUrl)"
                />
                <van-grid-item align="center"
                               icon="scan"
                               text="扫一扫"
                               @click="ScanCode()"
                />
                <van-grid-item align="center"
                               icon="scan"
                               text="按钮菜单管理"
                               to="buttonAuth"
                />
            </van-grid>
            <!--<van-row>
                <van-col align="center" span="24">
                    <van-image

                            height="200"
                            :src="require('../image/QRCode.jpg')"
                    />
                </van-col>

            </van-row>-->

            <van-field style="margin-top: 2rem;margin-bottom: 2rem"
                       v-model="suggest"
                       rows="2"
                       autosize
                       label="留言"
                       type="textarea"
                       maxlength="150"
                       placeholder="请输入你的建议"
                       show-word-limit
            />
            <van-button style="margin-bottom: 2rem" type="primary" block @click="postSugguest">提交</van-button>

            <van-row>
                <van-col align="center" span="24">Copyright © 2020 </van-col>
            </van-row>
        </div>
        <div style="height: 20%"></div>


    </div>

</template>

<script>
    import {postAction, getComm, postComm} from "../api/manage";
    import Notify from "vant/lib/notify";
    import {Dialog} from 'vant';
    import {websocket} from '../mixins/Websocket'
    import {wxScan} from '../mixins/WxScan'
    import axios from 'axios'

    export default {
        name: "home",
        mixins: [websocket, wxScan],
        data() {
            return {
                cs: '侧试',
                active: 0,
                suggest: '',
                userinfo: {headimgurl: 'https://img.yzcdn.cn/vant/cat.jpeg', nickname: '测试'},
                result: {authorization: '返乡'},
                btnPerson: false,
                btnIsolation: false,
                btnSampling: false,
                powerItem: [],
                openid: window.localStorage.getItem('openid'),
                pcId: '',
                popShow: false

            }
        },
        mounted() {
            // Notify({message: JSON.stringify(window.localStorage.getItem('userinfo')),type:'danger',duration: 15000})

            this.result = JSON.parse(window.localStorage.getItem('result'));
            this.getImg();
            this.powerItem = this.result.button;
            this.WXScanCode();
            this.initWebSocket(this.openid);
        },
        methods: {
            commLogin(loginUrl, targetUrl) {
                this.postLog(targetUrl);

                const params1 ={
                    openid:this.openid,
                    appName:"bi.jkgly.cn"
                }
                getComm('/auth/getRelateAccount',params1).then(res =>{
                    if (res.code===200) {
                        const params2= {"fr_username": res.result.appAccount, "fr_password":  res.result.appPassword}
                        getComm(loginUrl, params2).then(res => {
                            if (res.indexOf('success')) {
                                window.location.href = 'http://' + window.location.host + targetUrl//登录成功，直接跳转到平台系统页面
                            } else {
                                Notify({message: '登录超时', type: 'danger', duration: 2000})
                            }
                            //登录失败（用户名或密码错误）
                        }).catch(err => {
                            Notify({message: '登录超时' + err, type: 'danger', duration: 2000})
                        })
                    }else{
                        Notify({message: '用户未设置关联账号' , type: 'danger', duration: 2000})
                    }
                })

            },

            postLog(logContext) {
                const jsonData = JSON.stringify({
                    openid: this.openid,
                    eventinfo: logContext
                });
                postAction('/log/wxUserLog/PostLog', jsonData).then(res => {
                    if (res) {
                        console.log(res);
                    }
                })
            },
            postSugguest() {
                if (this.suggest === '' || this.suggest === null) {
                    Notify({message: '建议不能为空', type: 'warning', duration: 2000})
                    return
                }
                const jsonData = JSON.stringify({
                    openid: this.openid,
                    suggest: this.suggest
                });
                postAction('/PostGuggest', jsonData).then(res => {
                    this.suggest = ''
                    Notify({message: res.message, type: 'success', duration: 2000})
                }).catch(err => {
                    Notify({message: err, type: 'danger', duration: 2000})

                })
            },

            delegate(data) {
                console.log('调用代理' + data);
                const socketMsg = {
                    toUser: this.pcId,
                    type: 99,
                    message: {messageType: 22, content: data, responseCode: 0}
                };
                this.websocketSend(socketMsg);
            },
            wxBindpc(data) {
                const params = {
                    openid: this.openid,
                    pcId: data,
                    bindType: 'his'
                }

                postComm('/auth/addWxPcUser', params).then(res => {
                    if (res.code === 200) {
                        Dialog.confirm({
                            title: '标题',
                            message: '绑定成功,可以扫码'
                        })
                    }
                }).catch(err => {
                    console.log("后台请求连接失败" + err)
                })
            },
            ScanCode() {
                const params = {
                    openid: this.openid,
                    pcId: '',
                    bindType: 'his'
                }
                getComm('/auth/getWxPcUser', params).then(res => {
                    if (res.code === 200) {
                        this.pcId = res.result.pcId;
                        console.log('vue传递委托')
                        this.ScanPC(this.delegate);
                    } else {
                        Dialog.confirm({
                            title: '未绑定提醒',
                            message: '该微信未绑定电脑是否进行扫码绑定'
                        }).then(() => {
                            this.ScanPC(this.wxBindpc);
                            // this.pcId="ceshi"

                        }).catch(() => {

                        });
                    }
                }).catch(err => {
                    console.log("后台请求连接失败" + err)
                })

            },
            afterRead(file) {
                console.log(file);
                file.status = 'uploading';
                file.message = '上传中...';
                let data = new FormData();
                data.append('file', file.file)
                data.append('openid', this.openid)
                data.append('type', 'icon')
                console.log('>>>>', data)

                axios.post('/auth/upload', data).then(res => {
                    console.log(res)
                    file.status = 'done';
                    file.message = '上传成功';
                    this.userinfo.headimgurl = this.pathString(res.data.result);
                }).catch(err => {
                    console.log(err)
                    file.status = 'failed';
                    file.message = '上传失败';
                })

            },
            getImg() {
               // this.userinfo.nickname = JSON.parse(window.localStorage.getItem('userinfo')).nickname;
                let param = {
                    openid: this.openid,
                    type: 'icon'
                }
                getComm('/auth/getWxImg', param).then(res => {
                    console.log(res)
                    if (res.code === 200) {
                        this.userinfo.headimgurl =this.pathString(res.result);
                    } else {
                        console.log("<><><><>")
                 //       this.userinfo.headimgurl = JSON.parse(window.localStorage.getItem('userinfo')).headimgurl;
                    }
                })
            },
            popupShow(data) {
                this.popShow = data;
            },
            pathString(data){
                let imgpath = 'http://' + window.location.host + '/auth/download?group=' + data.groups + "&path=" + data.imgpath + '&fileName=' +  + 'icon.png'
                return imgpath;
            }

        }

    }
</script>

<style scoped>

</style>